<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>css选择器</title>
    <style>
        /*通过标签选择器，为所有标签添加上统一的样式*/
        p {
            text-indent: 2em;
            background-color: lightcyan;
        }
        div {
            background-color:hotpink;
        }

        /*类选择器*/

        .font-color {
            color: aqua;
        }

        .title {
            font-size: 18px;
            font-weight: bold;
            color: aquamarine;
        }

        #tledu {
            background-color: lightskyblue;
        }

        /*通配符选择器，可以给所有元素加上一些通用样式*/
        * {
            font-weight: bold;
        }
    </style>
</head>
<body>
<!--样式的优先级和先后顺序是没有关系的，和定义类的先后顺序有关系-->
<div class="title font-color">
    这是一个div
</div>

<div id="tledu">
    天亮教育
</div>

<p>
    这是第一个段落
    这是第一个段落
    这是第一个段落
    这是第一个段落
    这是第一个段落
    这是第一个段落
    这是第一个段落
    这是第一个段落
    这是第一个段落
    这是第一个段落
    这是第一个段落
    这是第一个段落
    这是第一个段落
    这是第一个段落
    这是第一个段落
</p>
<p>
    这是第二个段落
</p>
<p>
    这是第二个段落
</p>
<p>
    这是第二个段落
</p>
<p>
    这是第二个段落
</p>
<p>
    这是第二个段落
</p>
</body>
</html>